<template>
  <div style="padding-bottom:50px">
    <van-tabs>
      <van-tab title="全部">
      </van-tab>
      <van-tab v-for="(item,key) in orderType" :title="item" :key="key">
      </van-tab>
    </van-tabs>
    <div>
      <div class="order-list  mt-10">
        <ul>
          <li class="ff mb-10" v-for="(item,index) in 2" :key="index">
            <router-link to="orderDetails">
              <div class="list-item">
                <div class="p">
                  <router-link to="goodsDetail">
                    <img class="p-pic" v-lazy="'http://gw1.alicdn.com/bao/uploaded/c4/13/TB1etCbSpXXXXcsXXXXSutbFXXX.jpg_80x80.jpg'">
                  </router-link>
                </div>
                <div class="d">
                  <h3 class="d-title">Apple Store 官方旗舰店Apple Store 官方旗舰店Apple Store 官方旗舰店</h3>
                  <p class="d-main">金色  64G</p>
                  <p class="d-main clearfix"><span class="num fr">X1</span><span class="goods-price">&yen;5888</span></p>
                </div>
              </div>
            </router-link>
             <van-cell-group>
                <van-cell class="tr">
                  <template slot="title">
                    <span class="van-cell-text">共2件商品</span>
                    <span class="van-cell-text">合计：</span>
                    <span class="goods-price">&yen;5888</span>
                    <span class="van-cell-text">(含运费&yen;10)</span>
                  </template>
                </van-cell>
                <van-cell class="tr">
                  <template slot="title">
                    <span class="van-cell-text mr-20">已完成</span>
                    <van-button size="small">删除订单</van-button>
                    <!-- <van-button size="small">取消订单</van-button> -->
                    <router-link to="/orderDetails">
                      <van-button size="small">订单详情</van-button>
                    </router-link>
                    <router-link to="/evaluate">
                      <van-button size="small" >评价</van-button>
                    </router-link>
                  </template>
                </van-cell>
              </van-cell-group>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import {Cell, CellGroup,Field,SubmitBar,Checkbox,Row, Col,Icon,Tabs,Tab,Button} from 'vant';

export default {
  components: {
    [SubmitBar.name]: SubmitBar,
    [Checkbox.name]: Checkbox,
    [Row.name]: Row,
    [Col.name]: Col,
    [Icon.name]: Icon,
    [Cell.name]: Cell,
    [CellGroup.name]: CellGroup,
    [Tabs.name]: Tabs,
    [Tab.name]: Tab,
    [Field.name]: Field,
    [Button.name]:Button
  },
  methods:{
    onSubmit(){},
    onEdit(){
      this.$router.push({path:'/addressEdit',query:{id:this.chosenAddressId}})
    },
  },
  data(){
    return{
      orderType:['待付款','待发货','待收货','待评价','退款/售后'],
      currentContact:{
        'name':'',
        'tel':''
      },
      showList:false,
      list: [
        {
          id: '1',
          name: '张三',
          tel: '13000000000',
          address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室'
        },
        {
          id: '2',
          name: '李四',
          tel: '1310000000',
          address: '浙江省杭州市拱墅区莫干山路 50 号'
        }
      ]
    }
  }
};
</script>

<style lang="less">
</style>
